<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <meta name="keywords" content="瑜伽商城，瑜伽运动，运动，健身，锻炼">
    <meta name="description" content="瑜伽（英文：Yoga，印地语：योग）是一个汉语词汇，最早是从印度梵语“yug”或“yuj”而来，其含意为“一致”、“结合”或“和谐”。瑜伽源于古印度，是古印度六大哲学派别中的一系，探寻“梵我合一”的道理与方法。而现代人所称的瑜伽则主要是一系列的修身养心方法。">
    <title></title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" type="text/css" href="../css/reset.css">
    <link rel="stylesheet" type="text/css" href="../css/public.css">
    <link rel="stylesheet" type="text/css" href="../css/yoga.css">
    <link rel="stylesheet" type="text/css" href="../css/pubulic_wrap.css">
    <link rel="stylesheet" type="text/css" href="../css/all.css">
    <link rel="shortcut icon" href="../home/images/Yoga_03.png" type="image/png">
    <script type="text/javascript" src="../front_js/jquery.min.js"></script>
    <title>yoga-checkout</title>
</head>
<body>
<!--头部开始-->
<header class="shop-checkout white">
    <!--顶部图标-->
    <img src="../shop_checkout/images/33ShopCheckoutLogin_03.png" alt="" />
    <!--顶部二级导航-->
    <ul class="clearfix">
        <li><a href="#">Home</a>
            <ol>
                <li><a href="#">Yoga studio</a></li>
                <li><a href="#">Fitness club</a></li>
                <li><a href="#">Gym</a></li>
                <li><a href="#">Health club</a></li>
                <li><a href="#">Coach</a></li>
                <li><a href="#">Dance</a></li>
            </ol><i></i></li>
        <li><a href="#">Pages</a>
            <ol>
                <li><a href="#">About Us </a></li>
                <li><a href="#">Services</a></li>
                <li><a href="#">Reservations</a></li>
                <li><a href="#">Pricing Tables</a></li>
                <li><a href="#">Our Team</a></li>
                <li><a href="#">Content Elements</a></li>
            </ol><i></i></li>
        <li><a href="#">Events</a>
            <ol>
                <li><a href="#">All Events</a></li>
                <li><a href="#">Events One</a></li>
                <li><a href="#">Events Two</a></li>
                <li><a href="#">Events Three</a></li>
                <li><a href="#">Events Four</a></li>
                <li><a href="#">Single Event</a></li>
            </ol><i></i></li>
        <li><a href="#">Portfolio</a>
            <ol>
                <li><a href="#">Column 3 Сols</a></li>
                <li><a href="#">Columns 4 Сols Wide</a></li>
                <li><a href="#">4 Сols Masonry</a></li>
                <li><a href="#">Four Columns</a></li>
                <li><a href="#">Gallery</a></li>
            </ol><i></i></li>
        <li><a href="#">Blog</a>
            <ol>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Services</a></li>
                <li><a href="#">Reservations</a></li>
                <li><a href="#">Pricing Tables</a></li>
                <li><a href="#">Our Team</a></li>
                <li><a href="#">Content Elements</a></li>
            </ol><i></i></li>
        <li class="bdcolor"><a href="#">Shop</a></li>
        <li><a href="#">Contacts</a></li>
    </ul>
    <!--顶部二级导航右侧图标-->
    <div class="home-index-cart">
        <span><a href="#"><img src="../shop_checkout/images/33ShopCheckoutLogin_06.png" alt="" /></a></span>
        <span><a href="#"><img src="../shop_checkout/images/33ShopCheckoutLogin_08.png" alt="" /></a><div>0</div></span>
        <span>
                <a href="#"><img src="../shop_checkout/images/33ShopCheckoutLogin_10.png" alt="" /></a>
                <strong>EN</strong><strong>+</strong>
            </span>
    </div>
    <script>
        $("header ol").hide();
        $("header i").hide();
        $("header>ul>li").each(function(index,element){
            $(this).attr("index",index);
        })
        $("header>ul>li").mouseenter(function(){
            var index = $(this).attr("index");
            $("header ol").hide();
            $("header i").hide();
            $("header ol").eq(index).show();
            $("header i").eq(index).show();
            $(this).mouseleave(function(){
                $("header ol").hide();
                $("header i").hide();
            })
        })
    </script>
    <div class="checkout-top">
        <div class="content">
            <ul class="clearfix">
                <li class="jzz-cktop-l">CHECKOUT</li>
                <li class="jzz-cktop-r">
                    <ul class="clearfix">
                        <li><a href="#">Home</a></li>
                        <li> > </li>
                        <li><a href="#">Cart</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</header>
    <div class="shop-single-three clearfix">
        <div class="content">
            <div class="shop-single-three-left">
                <ul>
                    <li><a href=""><img src="../images/656ShopSingleProduct_03.jpg" alt=""></a></li>
                    <li><a href=""><img src="../images/656ShopSingleProduct_03.jpg" alt=""></a></li>
                    <li><a href=""><img src="../images/656ShopSingleProduct_03.jpg" alt=""></a></li>
                </ul>
                <div class="shop-single-three-left-img">
                    <li><a href=""><img src="../images/45ShopSingleProduct_05.jpg" alt=""></a></li>
                </div>
            </div>
            <div class="shop-single-three-right">
                <h2>Coated Dumbbell</h2>
                <ul class="clearfix">
                    <li><img src="../images/5454ShopSingleProduct_08.png" alt=""></li>
                    <li><img src="../images/5454ShopSingleProduct_08.png" alt=""></li>
                    <li><img src="../images/5454ShopSingleProduct_08.png" alt=""></li>
                    <li><img src="../images/5454ShopSingleProduct_08.png" alt=""></li>
                    <li><img src="../images/5454ShopSingleProduct_10.png" alt=""></li>
                    <li>(1 customer review)</li>
                </ul>
                <i>$1000</i><b>$20.55</b>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent est quis nisl vulputate, at pellentesque dolor luctus. Donec eget sagittis purus. Proin eu ornare tortor. Nunc mattis interdum tristique. Curabitur nec nisi sit amet velit aliquam interdum ut nec metus. </p>
                <div class="shop-single-three-right-bottom clearfix">
                    <div class="shop-single-three-right-left">
                        <span>
                            1
                           <a href=""><img src="../images/3246ShopSingleProduct_16.png" alt="" class="img-top"></a>
                           <a href=""><img src="../images/3246ShopSingleProduct_19.png" alt="" class="img-bottom"></a>
                        </span>
                    </div>
                    <a href="" class="type-a">Add to Cart</a>
                </div>
            </div>
        </div>
    </div>
    <div class="shop-single-four clearfix">
        <div class="content">
            <ul class="clearfix">
                <li  class="change-style">Description</li>
                <li>Additional Information</li>
                <li>Reviews (1)</a></li>
            </ul>
            <p class="show">Sed id felis at nulla dapibus viverra. Curabitur lacinia venenatis laoreet. Etiam a mollis tortor, at condimentum justo. Pellentesque semper porta congue. Nunc nec erat scelerisque, dapibus nulla eget, scelerisque nisl. Maecenas pellentesque, libero eu pharetra dignissim, nibh libero luctus arcu, eu imperdiet arcu metus interdum odio. Donec pharetra, elit et ultricies interdum, leo tellus vehicula velit, eget placerat nisl diam id lacus. Vestibulum tincidunt molestie sapien vel sodales. Nam nec elementum est. Morbi bibendum auctor mi nec scelerisque. Ut auctor quam lacus, quis tempor nulla sodales sit amet. Phasellus nibh sapien, rutrum sed metus eu, faucibus dapibus metus. Duis ullamcorper egestas neque, non sagittis turpis blandit ac. Nunc posuere dui ante, a tempus neque ornare ac. Suspendisse tincidunt semper odio, nec porttitor odio euismod at.</p>
            <p>Sed id felis at nulla dapibus viverra. Curabitur lacinia venenatis laoreet. Etiam a mollis tortor, at condimentum justo. Pellentesque semper porta congue. Nunc nec erat scelerisque, dapibus nulla eget, scelerisque nisl. Maecenas pellentesque, libero eu pharetra dignissim, nibh libero luctus arcu, eu imperdiet arcu metus interdum odio. Donec pharetra, elit et ultricies interdum, leo tellus vehicula velit, eget placerat nisl diam id lacus. Vestibulum tincidunt molestie sapien vel sodales. Nam nec elementum est. Morbi bibendum auctor mi nec scelerisque. Ut auctor quam lacus, quis tempor nulla sodales sit amet. Phasellus nibh sapien, rutrum sed metus eu, faucibus dapibus metus. </p>
            <p>Etiam a mollis tortor, at condimentum justo. Pellentesque semper porta congue. Nunc nec erat scelerisque, dapibus nulla eget, scelerisque nisl. Maecenas pellentesque, libero eu pharetra dignissim, nibh libero luctus arcu, eu imperdiet arcu metus interdum odio. Donec pharetra, elit et ultricies interdum, leo tellus vehicula velit, eget placerat nisl diam id lacus. Vestibulum tincidunt molestie sapien vel sodales. Nam nec elementum est. Morbi bibendum auctor mi nec scelerisque. Ut auctor quam lacus, quis tempor nulla sodales sit amet. Phasellus nibh sapien, rutrum sed metus eu, faucibus dapibus metus. Duis ullamcorper egestas neque, non sagittis turpis blandit ac. Nunc posuere dui ante, a tempus neque ornare ac. Suspendisse tincidunt semper odio, nec porttitor odio euismod at.</p>
        </div>
    </div>
    <div class="shop-single-five clearfix">
        <div class="Single-Product content">
            <p class="product-p home-y-words">Related Products</p>
            <ul class=" showing-wrap-li book-class pub-wrap-all flexbox">
                <li  class='product-li  showing-ul home-y-s-bc'>
                    <div >
                        <img src="../im/Layer748.png">
                    </div>
                    <div class="online ourclass-details">
                        <p class="class-name home-y-words">Mindful Resilience</p>
                        <p class="class-detail home-y-content"> <img src="../im/Shape52291.png"></p>
                        <p class="gym-money money-color">$ 79.99</p>
                        <a href="" class="show-button online-add you-cho-a border2">From $ 79.99</a>
                    </div>
                    <span class="new-product book-class-bc color">new</span>
                </li>
                <li  class='product-li  showing-ul home-y-s-bc'>
                    <div >
                        <img src="../im/Layer748.png">
                    </div>
                    <div class="online ourclass-details">
                        <p class="class-name home-y-words">Mindful Resilience</p>
                        <p class="class-detail home-y-content"> <img src="../im/Shape52291.png"></p>
                        <p class="gym-money money-color">$ 79.99</p>
                        <a href="" class="show-button online-add you-cho-a border2">From $ 79.99</a>
                    </div>
                    <span class="new-product book-class-bc color">new</span>
                </li>
                <li  class='product-li  showing-ul home-y-s-bc'>
                    <div >
                        <img src="../im/Layer748.png">
                    </div>
                    <div class="online ourclass-details">
                        <p class="class-name home-y-words">Mindful Resilience</p>
                        <p class="class-detail home-y-content"> <img src="../im/Shape52291.png"></p>
                        <p class="gym-money money-color">$ 79.99</p>
                        <a href="" class="show-button online-add you-cho-a border2">From $ 79.99</a>
                    </div>
                    <span class="new-product book-class-bc color">new</span>
                </li>
                <li  class='product-li  showing-ul home-y-s-bc'>
                    <div >
                        <img src="../im/Layer748.png">
                    </div>
                    <div class="online ourclass-details">
                        <p class="class-name home-y-words">Mindful Resilience</p>
                        <p class="class-detail home-y-content"> <img src="../im/Shape52291.png"></p>
                        <p class="gym-money money-color">$ 79.99</p>
                        <a href="" class="show-button online-add you-cho-a border2">From $ 79.99</a>
                    </div>
                    <span class="new-product book-class-bc color">new</span>
                </li>
            </ul>
        </div>
    </div>
<footer class="jzz-bott">
    <!--图标-->
    <img class="home-index-foottop" src="../home/images/home_index_foot_03.png" alt="">
    <!--文字-->
    <div class="home-index-footp">
        <p>Mauris justo sem, gravida ut enim a, rutrum molestie ligula.</p>
        <p>Cras in massa metus. Suspendisse potenti. Nam sagittis</p>
    </div>
    <!--文字-->
    <p>Subscribe us</p>
    <!--邮件input框-->
    <div class="home-index-footserch">
        <input type="text" placeholder="Enter your email" />
        <span>SEND</span>
    </div>
    <!--三个小图片-->
    <div class="home-index-footimg">
        <a href="#"><img src="../home/images/home_index_foot_07.png" alt="" /></a>
        <a href="#"><img src="../home/images/home_index_foot_09.png" alt="" /></a>
        <a href="#"><img src="../home/images/home_index_foot_11.png" alt="" /></a>
    </div>
    <!--底部导航-->
    <ul class="home-index-footnav clearfix">
        <li><a href="#">Home</a></li>
        <li><a href="#">Pages</a></li>
        <li><a href="#">Envents</a></li>
        <li><a href="#">Portfolio</a></li>
        <li><a href="#">Blog</a></li>
        <li><a href="#">Shop</a></li>
        <li><a href="#">Contacts</a></li>
    </ul>
</footer>
<!--返回顶部图标-->
<img class="home-gotop" src="../home/images/home_index_foot_14.png" alt="" />
<script>
    $(".home-gotop").hide();
    $("body").ready(function(){
        $(".home-gotop").click(function(){
            $("html,body").animate({scrollTop:0},250);
        });
        setInterval(function(){
            if($("html,body").scrollTop() === 0) {
                $(".home-gotop").hide();
            }
            else{
                $(".home-gotop").show();
            }
        },500)
    });
</script>
    <script>
        var aList = $(".shop-single-four ul li")
        var pList = $(".shop-single-four p")
        aList.click(function(){
            var index = $(this).index()
            $(this).addClass("change-style").siblings().removeClass("change-style")
            pList.eq(index).addClass("show").siblings().removeClass("show")
        })
    </script>
</body>
</html>